import QtQuick 1.0

Item {
    id: planeWithBanner
    width: planeImg.width + rope.width + banner.width
    signal animationDone;
    signal disappearDone;

    property alias text: bannerText.text

    Row {
        anchors.verticalCenter: parent.verticalCenter
        Image {
            id: planeImg
            anchors.verticalCenter: parent.verticalCenter
            source: "assets/planesmall.png"
            transform: Rotation {
                origin.x: planeImg.width / 2;
                origin.y: planeImg.height / 2;
                axis { x: 0; y: 1; z: 0 }
                angle: 180
            }
        }

        Rectangle {
            id: rope
            width: 50
            height: 1
            color: "black"
            anchors.verticalCenter: parent.verticalCenter
        }

        Rectangle {
            id: banner
            border.color: "black"
            color: "#aaffff00"
            width: 340
            height: childrenRect.height + 10
            anchors.verticalCenter: parent.verticalCenter

            Text {
                width: 340
                font.family: throwHands.name
                font.pointSize: 16
                id: bannerText
                verticalAlignment: "AlignVCenter"
                horizontalAlignment: "AlignHCenter"
                anchors.horizontalCenter: parent.horizontalCenter
                wrapMode: "WordWrap"
            }
        }
    }

    transform: [
        Rotation {
            id: animRotation
            origin.x: planeWithBanner.width / 2;
            origin.y: planeWithBanner.height / 2;
            axis { x: 0; y: 1; z: 0 }
        },

        Scale {
            id: animScale
            origin.x: planeWithBanner.width / 2;
            origin.y: planeWithBanner.height / 2;
        }
    ]

    SequentialAnimation {
        id: animLong
        running: false
        ScriptAction {
            script: {
                animRotation.angle = 180;
                animScale.xScale = 0.5
                animScale.yScale = 0.5
            }
        }

        PropertyAnimation {
            duration: 4000
            target: planeWithBanner
            property: "x"
            to: 360
            from: -planeWithBanner.width
        }

        ScriptAction {
            script: {
                animShort.start()
            }
        }
    }

    SequentialAnimation {
        id: animShort
        running: false

        ScriptAction {
            script: {
                animRotation.angle = 0
                animScale.xScale = 1
                animScale.yScale = 1
            }
        }

        PropertyAnimation {
            duration: 1500
            target: planeWithBanner
            property: "x"
            from: 360
            to: 360 - banner.width - rope.width - planeImg.width - ((360 - banner.width) / 2)
        }

        ScriptAction {
            script: {
                planeWithBanner.animationDone();
            }
        }
    }

    SequentialAnimation {
        running: false
        id: animDisappear
        PropertyAnimation {
            duration: 1000
            target: planeWithBanner
            property: "x"
            to: -planeWithBanner.width
        }

        ScriptAction {
            script: {
                planeWithBanner.disappearDone()
            }
        }
    }

    function flyInLong() {
        animLong.start()
    }

    function flyInShort() {
        animShort.start()
    }

    function completeAnim() {
        if (animLong.running) {
            animLong.complete()
        }
        if (animShort.running) {
            animShort.complete()
        }
    }

    function flyOut() {
        animDisappear.start()
    }
}
